<template>
    <div> Computed </div>
</template>

<script lang="ts">
import { computed, defineComponent, ref } from 'vue'

export default defineComponent({
    setup() {
        // computed方法返回一个只读的响应式ref，方法定义同computed选项
        // 方式一：参数为函数
        // let count = ref(0)
        // const calcCount = computed(() => {
        //     return count.value + 1
        // })
        // console.log(calcCount, calcCount.value); 
        // count.value = 10
        // setTimeout(() => {
        //     console.log(calcCount, calcCount.value);
        // }, 1000);
        // 方式二：参数为get set对象
        // let newCount = ref(0)
        // const newCalcCount = computed({
        //     get: () => newCount.value + 1,
        //     set: (val: number) => {
        //         newCount.value = val
        //     }
        // })
        // console.log(newCalcCount.value);
        // newCalcCount.value = 10
        // console.log(newCalcCount.value, newCount.value);
    },
})
</script>
